<html>
<head>
<style>
.chs-feed {
	min-width: 460px;
}
.chs-stream {
	border-style: solid;
	border-width: 1px;
	float: left;
	margin: 5px;
	margin-top: 0px;
	padding: 10px;
	position: absolute;
	top: 8px;
	left: 5px;
	bottom: 5px;
	overflow: auto;
}
.chs-img {
	max-width: 200px;
	max-height:200px;
}
.chs-img-right{
	float:right;
	max-width: 200px;
	max-height:200px;
}
.chs-or {
	width: 40px;
	font-weight: bold;
	margin-left:30px;
}
.chs-post {
	border-style: solid;
	border-width: 1px;
	margin-bottom: -1px;
	border-color: black;
	padding: 10px;
}
.comments {
	display: block;
	/*float: right;*/
	/*padding-top: 30px;*/
}
.chs-votes {
	margin: 10px;
}
.chs-votes-users {
float: left;
width: 50%;
}
.chs-vote:hover {
	background: #eee;
	color: #11a;
}
.chs-vote {
	margin: 36px;
	padding: 10px;
}
.chs-vote:link {
	color: black;
	text-decoration: none;
}
.vote {
	color: transparent;
	margin: 20px;
}
.chs-vote:hover {
	text-decoration: underline;
}
.chs-vote:hover .vote {
	color: blue;
}
.chs-questcont {
	margin: 20px;
	margin-top: 60px;
}
.chs-question {
	border-style: solid;
	padding: 10px;
	margin: 10px;
	border-width: 1px;
}
.chs-form {
	border-style: solid;
	padding: 10px;
	border-width: 1px;
	margin: 5px;
	margin-left: 550px;
}
.new_user {
	margin-left: 550px;
}
</style>
</head>
<body>
	<div class="chs-stream">
		<h1>Choosie Public Feed</h1>
		<div class="chs-feed">
			{% for choosie_post in choosie_posts %}
			<div class="chs-post">
				<div class="chs-user-data">
					<img src="{{ choosie_post.user.avatar }}">
					{{ choosie_post.user.first_name + ' ' + choosie_post.user.last_name }}
				</div>
				<div class="chs-questcont">Question:<span class="chs-question">{{ choosie_post.question|escape }}</span></div>
				<div class="images">
					<img class="chs-img" src="{{ choosie_post.photo1 }}"></img>
					<img class="chs-img-right" src="{{ choosie_post.photo2 }}"></img>
				</div>
				<div class="chs-votes">
					<a class="chs-vote" href="/votes/new?fb_uid=100004697466881&which_photo=1&post_key={{ choosie_post.key }}">
						<span class="vote">Vote!!</span>
					</a>
					<a class="chs-vote" href="/votes/new?fb_uid=100004697466881&which_photo=2&post_key={{ choosie_post.key }}">
						<span class="vote">Vote!!</span>
					</a>
				</div>
				<div class="chs-votes-users">
					Voted for 1:
					{% for vote in choosie_post.votes %}
					{% if vote.vote_for == 1 %}
					<div>{{ vote.user.first_name }} {{ vote.user.last_name }}</div>
					{% endif %}
					{% endfor %}
				</div>
				<div class="chs-votes-users">
					Voted for 2:
					{% for vote in choosie_post.votes %}
					{% if vote.vote_for == 2 %}
					<div>{{ vote.user.first_name }} {{ vote.user.last_name }}</div>
					{% endif %}
					{% endfor %}
				</div>
				<div class="comments">
					<b>Comments:</b>
					{% for comment in choosie_post.comments %}
					<div class="single_comment">
						<img src="{{ comment.user.avatar }}">
						<b>{{ comment.user.first_name }} {{ comment.user.last_name }}</b>
						{{ comment.text }}
					</div>
					{% endfor %}
					<form action="/comments/new" enctype="multipart/form-data" method="post">
						Comment: <input type="text" name="text"/>
						<br>
						<input type="hidden" value="100004697466881" name="fb_uid"/>
						<input type="hidden" name="post_key" value="{{choosie_post.key}}"/>
						<input type="submit" value="Add">
					</form>
				</div>
				<div class="debug">
<!--					<b>Key:</b>{{choosie_post.key|escape}} -->
					<b>Scape comments:</b>
					<form action="/scrape" enctype="multipart/form-data" method="post">
						<input type="hidden" name="choosie_post_key" value="{{choosie_post.key}}">
						<div><input type="submit" value="Scrape!"></div>
					</form>
				</div>
			</div>
			{% endfor %}
		</div>
		<div class="more_button">
			<form action="/" method="get">
				<input type="hidden" name="cursor" value="{{cursor}}"/>
				<input type="hidden" name="limit" value="{{limit}}"/>
				<input type="submit" value="Get more posts">
			</form>
		</div>
	</div>
	<div class="chs-form">
		<h1>Upload your dilemma</h1>
		<form action="/posts/new" enctype="multipart/form-data" method="post">
			<div>Photo 1: <input type="file" name="photo1" /></div>
			<div>Photo 2: <input type="file" name="photo2" /></div>
			<div>Question: <input type="text" name="question" value="yo-app!"/></div>
			<div>UID: <input type="text" name="fb_uid" value="100004161394098"/> </div>
			<div>Access Token:<input type="text" name="fb_access_token" value="BAAHVHgMjmJwBAN6rP3xy5OaRthY3tjZBY0bQZBtbauvEvAhJgEyn1iPLFo3c3rJGPAKumZAvMp3dMAFKPsH1c8u3jq2EZAUgEq6hKIsgE6KN94S64p8vEGhy83ZBQLhrRg6WHb6dAwAZDZD" size="100"/></div>
			<div>Access Token Expdate: <input type="text" name="fb_access_token_expdate" value="1358319035143"/></div>
			<input type="checkbox" name="share_to_fb">Share on FB
			<div><input type="submit" value="Post!"></div>
		</form>
	</div>
	<div class="new_user">
		<H1>Add user</H1>
		<form action="/login" enctype="multipart/form-data" method="post">
			<div>Access Token:<input type="text" name="fb_access_token" value="BAAHVHgMjmJwBAFBRxHpWbGJMAzIWAtYfqEyYQSISOYhzjuZCvvjWhO6YfjiccSUlrulxqqevJq7yZAoaxR0zQmmhFgmuI3JBnNZBZAMAyMKW0gfGl7TuUlglrEzGqKHsN7hH5L7GsQZDZD" size="100"/></div>
			<div>Access Token Expdate: <input type="text" name="fb_access_token_expdate" value="1358319035143"/></div>
			<div>Uid:<Input type = "text" name ="fb_uid" value="100004697466881"/></div>

			<div><input type="submit" value="Login"></div>
		</form>
	</div>
</body>
</html>
